<div class="pannel">
    <div class="pannel-head">
        <p>
            <span class="title">资产变化感知</span>
        </p>
    </div>
    <div class="pannel-body">
        <!-- 下拉 -->
        <div class="pannel-filter">
            <div class="pannel-filter-left">
                <nz-select style="width: 120px" [(ngModel)]="pages.keyLevel" (ngModelChange)="search()">
                    <nz-option nzValue="" nzLabel="全部企业"></nz-option>
                    <nz-option nzValue="keyeLevel" nzLabel="重点企业"></nz-option>
                    <nz-option nzValue="NonKey" nzLabel="非重点企业"></nz-option>
                </nz-select>
                <nz-select style="width: 120px" [(ngModel)]="pages.status" (ngModelChange)="search()">
                    <nz-option nzValue="" nzLabel="全部"></nz-option>
                    <nz-option nzValue="Normal" nzLabel="正常"></nz-option>
                    <nz-option nzValue="Disabled" nzLabel="已禁用"></nz-option>
                    <nz-option nzValue="ToBeRectified" nzLabel="待整改"></nz-option>
                </nz-select>
                <!-- 地点选择 -->
                <nz-tree-select 
                    style="width: 120px" 
                    [nzNodes]="citys" 
                    nzPlaceHolder="请选择地区"
                    [(ngModel)]="cityValue" 
                    (ngModelChange)="onChange($event)">
                </nz-tree-select>
            </div>
            <div class="pannel-filter-right">
                <nz-input-group [nzSuffix]="suffixIconSearch">
                    <input type="text" nz-input  [(ngModel)]="pages.name" placeholder="请输入企业名称" />
                </nz-input-group>
                <ng-template #suffixIconSearch>
                    <i nz-icon type="search" (click)='search()'></i>
                </ng-template>
            </div>
        </div>
        <!-- list -->
        <div>
            <nz-table class="pannel-body-table" #nzTable [nzScroll]="{ y: '252px' }" [nzData]="list"
                [nzShowPagination]="true" [nzLoading]="tableLoading" [nzFrontPagination]="false"
                [nzPageIndex]="pages.pageNo" [nzTotal]="pages.total" [nzPageSize]="pages.pageSize"
                [nzPageSizeOptions]="[10,20,30,40,50]" [nzShowQuickJumper]="true" [nzShowSizeChanger]="true">
                <thead>
                    <tr>
                        <th nzWidth="10%">企业名称</th>
                        <th nzWidth="10%">变化时间</th>
                        <th nzWidth="10%">变化类型</th>
                        <th nzWidth="10%">原资产</th>
                        <th nzWidth="10%">现资产</th>
                        <th nzWidth="10%">备注消息</th>
                        <th nzWidth="10%">操作</th>
                    </tr>
                </thead>
                <tbody>
                    <tr *ngFor="let data of list" 
                        [ngClass]="{active:data?.id === selectRow?.id}">
                        <td nzWidth="10%">{{ data.name }}</td>
                        <td nzWidth="10%">{{ data.legalRepresentative }}</td>
                        <td nzWidth="10%">{{data.cityName}}{{data.areaName}}{{ data.address }}</td>
                        <td nzWidth="10%">{{ data.assetTotalCount }}</td>
                        <td nzWidth="10%">{{ data.vulnTotalCount }}</td>
                        <td nzWidth="10%">
                            <nz-tag *ngIf="data.status === 'Normal'" [nzColor]="'#87d068'">正常</nz-tag>
                            <nz-tag *ngIf="data.status === 'Disabled'" [nzColor]="'#f50'">已禁用</nz-tag>
                            <nz-tag *ngIf="data.status === 'ToBeRectified'" [nzColor]="'rgb(110 244 157)'">待整改</nz-tag>
                        </td>
                        <td nzWidth="10%">
                            <a  style="margin-right: 8px;" routerLink="/assetsMgmt/assetsChange/edit"  [queryParams]="{ id : data.id}">修改</a>  
                            <a
                            nz-popconfirm
                            nzTitle="企业被禁用后，将无法对该企业进行监测！"
                            nzOkText="确定"
                            nzCancelText="取消"
                            (nzOnConfirm)="confirm()"
                            (nzOnCancel)="cancel()"
                            >
                                <font *ngIf="data.status === 'Disabled'" style="color: #87d068;">正常</font>
                                <font *ngIf="data.status === 'Normal'" style="color: #f50;">禁用</font>
                            </a>
                        </td>
                    </tr>
                </tbody>
            </nz-table>
            <ng-template #totalTemplate let-total> 共{{ pages?.pages }}条</ng-template>
        </div>
    </div>
</div>